<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="Expires-Type" content="0"/>
    <meta http-equiv="Pragma" content="no-cache"/>
    <meta http-equiv="Cache-Control" CONTENT="no-cache"/>
    <title>账户安全</title>
    <link type="text/css" rel="stylesheet"
          href="//misc.360buyimg.com/jdf/1.0.0/unit/??ui-base/5.0.0/ui-base.css,shortcut/5.0.0/shortcut.css,global-header/1.0.0/global-header.css,myjd/5.0.0/myjd.css,nav/2.0.0/nav.css,shoppingcart/2.0.0/shoppingcart.css,global-footer/5.0.0/global-footer.css,service/5.0.0/service.css,basePatch/1.0.0/basePatch.css"/>
    <script type="text/javascript"
            src="//misc.360buyimg.com/jdf/1.0.0/unit/??base/5.0.0/base.js,basePatch/1.0.0/basePatch.js"></script>
    <link rel="stylesheet" type="text/css" href="//misc.360buyimg.com/user/myjd-2015/css/myjd.info.css" media="all">
    <link type="text/css" rel="stylesheet" href="//misc.360buyimg.com/user/myjd-2015/widget/??common/common.css"
          source="widget"/>
    <script type="text/javascript"
            src="//misc.360buyimg.com/jdf/??lib/jquery-1.6.4.js,1.0.0/unit/libPath/1.0.0/libPath.js"></script>

</head>

<!--set|info-->
<body myjd="_MYJD_info" menuId="set">
<!--shortcut start-->
<div id="shortcut-2014">
    <div class="w">
        <ul class="fl">
            <li id="ttbar-home"><i class="iconfont">&#xe608;</i><a href="http://meimeimall.com/" target="_blank">商城首页</a>
            </li>
            <li class="dorpdown" id="ttbar-mycity"></li>
        </ul>
        <ul class="fr">
            <li class="fore1" id="ttbar-login">
                <a class="link-login">你好 [[${session.loginUser==null?'':session.loginUser.username}]]</a>&nbsp;&nbsp;
            </li>
            <li class="spacer"></li>
            <li class="fore2">
                <div class="dt">
                    <a target="_blank" href="http://order.meimeimall.com/orderlist.html">我的订单</a>
                </div>
            </li>
            <li class="spacer"></li>
            <li class="fore3 dorpdown" id="ttbar-myjd">
                <div class="dt cw-icon">
                    <!-- <i class="ci-right"><s>◇</s></i> -->
                    <a target="_blank" href="//home.jd.com/">我与商城</a>
                </div>
            </li>
            <li class="spacer"></li>
            <li class="fore4" id="ttbar-member">
                <div class="dt">
                    <a target="_blank" href="//vip.jd.com/">会员服务</a>
                </div>
            </li>
        </ul>
        <span class="clr"></span>
    </div>
</div>
<div id="o-header-2013">
    <div id="header-2013" style="display:none;"></div>
</div>
<!--shortcut end-->

<div id="nav">
    <div class="w">
        <div class="logo">
            <a href="http://meimeimall.com" target="_blank" class="fore1"
               clstag="homepage|keycount|home2013|Homejdlogo"></a>
            <a href="" target="_self" class="fore2" clstag="homepage|keycount|home2013|Homebackm">我与商城</a>
            <a href="http://meimeimall.com" target="_blank" class="fore3" clstag="homepage|keycount|home2013|Homebackjd">返回商城首页</a>
        </div>
        <div class="navitems">
            <ul>
                <li class="fore-1">
                    <a target="_self" href="" clstag="homepage|keycount|home2013|Homeindex">首页</a>
                </li>
                <li class="fore-3">
                    <div class="dl" clstag="click|keycount|myhome|hsz">
                        <div class="dt">
                            <span class="myjd-set">账户设置</span>
                            <b></b>
                        </div>
                        <div class="dd">

                            <a tid="_MYJD_info" clstag="Homeyser" href="http://member.meimeimall.com/web/info.html"
                               target="_self"><span>个人信息</span></a>
                            <a tid="_MYJD_safe" clstag="Homesafe" href="http://member.meimeimall.com/web/secret.html"
                               target="_self"><span>账户安全</span></a>
                            <a tid="_MYJD_accbinde" clstag="Homezhbd" href="//safe.jd.com/union/index.action"
                               target="_self"><span>账号绑定</span></a>
                            <a tid="_MYJD_comments" clstag="homeadd"
                               href="http://member.meimeimall.com/web/address.html"
                               target="_self"><span>收货地址</span></a>
                            <a tid="_MYJD_pay" clstag="Homequick"
                               href="https://authpay.jd.com/card/queryBindCard.action"
                               target="_blank"><span>我的银行卡</span></a>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="nav-r">
            <div id="settleup-2014" class="dorpdown">
                <div class="cw-icon">
                    <i class="ci-left"></i>
                    <i class="ci-right">></i>
                    <a target="_blank" href="//cart.jd.com/cart.action">我的购物车</a>
                </div>
                <div class="dorpdown-layer">
                    <div class="spacer"></div>
                    <div id="settleup-content">
                        <span class="loading"></span>
                    </div>
                </div>
            </div>
            <div id="hotwords-2014"></div>
        </div>
        <div class="clr"></div>
    </div>
</div>

<!--container start-->

<div id="container">
    <div class="thickbox" id="editBox"
         style="left: 567.5px; top: 0px; width: 762px; height: 672px; display: none">
        <div class="thickwrap" style="width: 760px;">
            <div class="thicktitle" id="" style="width:740"><span>添加收货地址</span></div>
            <div class="thickcon" id=""
                 style="width: 740px; height: 620px; padding-left: 10px; padding-right: 10px;">
                <div id="addressDiagDiv">

                    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
                    <link type="text/css" rel="stylesheet"
                          href="//misc.360buyimg.com/jdf/1.0.0/unit/??ui-base/1.0.0/ui-base.css,shortcut/2.0.0/shortcut.css,global-header/1.0.0/global-header.css,myjd/2.0.0/myjd.css,nav/2.0.0/nav.css,shoppingcart/2.0.0/shoppingcart.css,global-footer/1.0.0/global-footer.css,service/1.0.0/service.css,basePatch/1.0.0/basePatch.css">
                    <link type="text/css" rel="stylesheet"
                          href="//misc.360buyimg.com/user/myjd-2015/widget/??common/common.css"
                          source="widget">
                    <link type="text/css" rel="stylesheet"
                          href="//misc.360buyimg.com/user/myjd-2015/css/myjd.easebuy.css"
                          source="combo">
                    <title>收货地址</title>


                    <div class="m" id="edit-cont">
                        <div class="mc">
                            <div class="form">
                                <input id="addressId_input" style="display: none">
                                <input id="defaultStatus_input" style="display: none">
                                <input id="is-recommend-area" value="true" style="display: none">
                                <div class="item">
                                    <span class="label"><em>*</em>收货人：</span>
                                    <div class="fl">
                                        <input id="consigneeName_input" type="text" class="text">
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="item">
                                    <span class="label"><em>*</em>省份：</span>
                                    <div class="fl">
                                        <input id="provinceName_input" type="text" class="text">
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="item">
                                    <span class="label"><em>*</em>城市：</span>
                                    <div class="fl">
                                        <input id="cityName_input" type="text" class="text">
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="item">
                                    <span class="label"><em>*</em>街道：</span>
                                    <div class="fl">
                                        <input id="regionName_input" type="text" class="text">
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="item" id="recommendAdd" style="display: none;">
                                    <div class="fl consignee-auto-tip">
                                        <i class="arrow-up"></i>
                                        <div id="recommendAddList">
                                        </div>
                                    </div>
                                </div>


                                <div class="item">
                                    <span class="label"><em>*</em>详细地址：</span>
                                    <div class="fl">
                                                                            <span style="float: left;margin-right: 5px;line-height:32px;"
                                                                                  id="areaName"></span>
                                        <input id="detailAddress_input" type="text" class="text text1">
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="item">
                                    <div class="fl">
                                        <span class="label"><em>*</em>手机号码：</span>
                                        <span class="telnum-prefix"
                                              id="span_consignee_areaCode">0086</span>
                                    </div>
                                    <div class="fl"><span class="extra-span ftx-03">-</span></div>
                                    <div class="fl">
                                        <span class="label"></span>
                                        <input id="phone_input" type="text" maxlength="11"
                                               class="text">
                                        <span class="error-msg hide" id="consigneeMobileNote"></span>
                                        <span class="clr"></span>
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="item" id="postcode_div">
                                    <span class="label"><em>*</em>邮政编码：</span>
                                    <div class="fl">
                                        <input id="postcode_input" value="" maxlength="50" type="text"
                                               class="text">
                                        <span class="error-msg hide" id="postCodeNote"></span>
                                    </div>
                                    <div class="clr"></div>
                                </div>

                                <div class="btns">
                                    <a href="javascript:;" onclick="function saveAddress() {
                                        var addressId_input = document.getElementById('addressId_input').value;
                                        var defaultStatus_input = document.getElementById('defaultStatus_input').value;
                                        var consigneeName_input = document.getElementById('consigneeName_input').value;
                                        var provinceName_input = document.getElementById('provinceName_input').value;
                                        var cityName_input = document.getElementById('cityName_input').value;
                                        var regionName_input = document.getElementById('regionName_input').value;
                                        var detailAddress_input = document.getElementById('detailAddress_input').value;
                                        var phone_input = document.getElementById('phone_input').value;
                                        var postcode_input = document.getElementById('postcode_input').value;
                                        if(consigneeName_input ==='' || provinceName_input === ''
                                        || cityName_input === '' || regionName_input === '' || detailAddress_input === ''
                                        || phone_input === '' || postcode_input === ''){
                                            alert('请完整填写所有内容');
                                            return;
                                        }
                                        var jsonData = {'id':addressId_input,
                                                   'defaultStatus': defaultStatus_input,
                                                   'name': consigneeName_input,
                                                   'phone': phone_input,
                                                   'postCode': postcode_input,
                                                   'province': provinceName_input,
                                                   'city': cityName_input,
                                                   'region': regionName_input,
                                                   'detailAddress': detailAddress_input}
                                        $.ajax({
                                            url: 'http://member.meimeimall.com//web/addOrUpdateAddress',
                                            type: 'post',
                                            contentType: 'application/json',
                                            dataType: 'json',
                                            data: JSON.stringify(jsonData),
                                            async: false,
                                            xhrFields: {
                                                withCredentials: true
                                            },
                                            crossDomain: true,
                                            success: function (data) {
                                                alert(data.msg);
                                                location.href='http://member.meimeimall.com/web/address.html';
                                            }
                                        });
                                    }
                                    saveAddress();"
                                       class="e-btn btn-9 save-btn">保存收货地址</a>
                                    <a style="margin-left: 30px" id="closeBox" onclick="function closeBox() {
                                        var editbox = document.getElementById('editBox');
                                        editbox.style.display='none';
                                    }
                                    closeBox()">取消</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="w">
        <div id="content">
            <div id="sub">
                <div id="menu">
                    <dl class="fore1">
                        <dt id="_MYJD_setting">设置</dt>
                        <dd class="fore1_1" id="_MYJD_info">
                            <a clstag="homepage|keycount|home2013|Homeyser"
                               href="http://member.meimeimall.com/web/info.html" target="_self"
                               style="color: #777; font-weight: 400;">个人信息</a>
                        </dd>
                        <dd class="fore1_2" id="_MYJD_safe">
                            <a clstag="homepage|keycount|home2013|Homesafe"
                               href="http://member.meimeimall.com/web/secret.html"
                               target="_self" style="color: #777; font-weight: 400;">账户安全</a>
                        </dd>
                        <dd class="fore1_3" id="_MYJD_accbinde">
                            <a clstag="homepage|keycount|home2013|Homezhbd" href="//safe.jd.com/union/index.action"
                               target="_self">账号绑定</a>
                        </dd>
                        <dd class="fore1_5" id="_MYJD_comments">
                            <a clstag="homepage|keycount|home2013|homeadd"
                               href="http://member.meimeimall.com/web/address.html" target="_self"
                               style="color: #e4393c; font-weight: 700;">收货地址</a>
                        </dd>
                        <dd class="fore1_11" id="_MYJD_pay">
                            <a clstag="homepage|keycount|home2013|Homequick"
                               href="https://authpay.jd.com/card/queryBindCard.action" target="_blank">我的银行卡</a>
                        </dd>
                    </dl>
                </div>
            </div>

            <div id="main">
                <div id="addressList" class="mod-main mod-comm">
                    <div class="mt">
                        <a id="edit-add-dialog" onclick="function alertAddAddressDiag() {
                            var editbox = document.getElementById('editBox');
                            document.getElementById('addressId_input').value='';
                            document.getElementById('consigneeName_input').value='';
                            document.getElementById('provinceName_input').value='';
                            document.getElementById('cityName_input').value='';
                            document.getElementById('regionName_input').value='';
                            document.getElementById('detailAddress_input').value='';
                            document.getElementById('phone_input').value='';
                            document.getElementById('postcode_input').value='';
                            document.getElementById('editBox').style.display='block';
                            editbox.style.display='block';
                        }
                        alertAddAddressDiag()" class="e-btn add-btn btn-5"
                           href="javascript:;">新增收货地址</a>
                        <span class="ftx-03">您已创建<span id="addressNum_top" class="ftx-02"
                                                       th:text="${addressList.size()}"></span> 个收货地址，最多可创建<span
                                class="ftx-02" id="addressNum_top_limit">25 </span>个</span>
                    </div>

                    <div class="mc">
                        <ul>
                            <li th:each="address:${addressList}" th:attr="addressId=${address.getId()}">
                                <div class="sm easebuy-m ">
                                    <div class="smt">
                                        <h3>
                                            [[${address.name}]]
                                            <span class="ftx-04 ml10"
                                                  th:if="${address.getDefaultStatus() == 1}">默认地址</span>
                                            <input th:id="${address.getId() + '_defaultStatus'}"
                                                   th:value="${address.getDefaultStatus()}" style="display: none"/>
                                        </h3>
                                        <div class="extra">
                                            <a th:id="${address.getId()}" onclick="function alertDelAddressDiag(param) {
                                                var bool= confirm('是否删除该收货地址?');
                                                if(bool === true){
                                                    var addressId = param.id;
                                                    $.ajax({
                                                        url: 'http://member.meimeimall.com/web/deleteAddress',
                                                        data: {'id':addressId},
                                                        async: false,
                                                        xhrFields: {
                                                            withCredentials: true
                                                        },
                                                        crossDomain: true,
                                                        success: function (data) {
                                                            if(data.code === 0){
                                                                alert('删除成功');
                                                                location.href='http://member.meimeimall.com/web/address.html';
                                                            }else{
                                                                alert(data.msg);
                                                                location.href='http://member.meimeimall.com/web/address.html';
                                                            }
                                                        }
                                                    });
                                                }
                                            }
                                            alertDelAddressDiag(this)" class="del-btn" style="color: red">删除</a>
                                        </div>
                                    </div>

                                    <div class="smc">
                                        <div class="items new-items">
                                            <div class="item-lcol">
                                                <div class="item">
                                                    <span class="label"
                                                          style="text-align: left; width: 70px">收货人：</span>
                                                    <div>
                                                        <span style="text-align: left; width: 300px"
                                                              th:id="${address.getId() + '_consignName'}"
                                                              th:text="${address.getName()}"></span>
                                                    </div>
                                                    <div class="clr"></div>
                                                </div>
                                                <div class="item">
                                                    <span class="label"
                                                          style="text-align: left; width: 70px">所在地区：</span>
                                                    <div>
                                                        <span style="text-align: left; width: 300px"
                                                              th:id="${address.getId() + '_position'}"
                                                              th:text="${address.getProvince() + '-' + address.getCity() + '-' + address.getRegion()}">
                                                        </span>
                                                    </div>
                                                    <div class="clr"></div>
                                                </div>
                                                <div class="item">
                                                    <span class="label"
                                                          style="text-align: left; width: 70px">详细地址：</span>
                                                    <div>
                                                        <span style="text-align: left; width: 300px"
                                                              th:id="${address.getId() + '_detailAddress'}"
                                                              th:text="${address.getProvince() + address.getCity() + address.getRegion() + address.getDetailAddress()}">
                                                        </span>
                                                        <input id="${address.getId() + '_detailAddressNoPrefix'}"
                                                               th:value="${address.getDetailAddress()}"
                                                               style="display: none"/>
                                                    </div>
                                                    <div class="clr"></div>
                                                </div>
                                                <div class="item">
                                                    <span class="label" style="text-align: left; width: 70px">手机：</span>
                                                    <div>
                                                        <span style="text-align: left; width: 300px"
                                                              th:id="${address.getId() + '_phone'}"
                                                              th:text="${address.getPhone()}">
                                                        </span>
                                                    </div>
                                                    <div class="clr"></div>
                                                </div>
                                                <div class="item">
                                                    <span class="label"
                                                          style="text-align: left; width: 70px">邮政编码：</span>
                                                    <div>
                                                        <span style="text-align: left; width: 300px"
                                                              th:id="${address.getId() + '_postcode'}"
                                                              th:text="${address.getPostCode()}">
                                                        </span>
                                                    </div>
                                                    <div class="clr"></div>
                                                </div>
                                            </div>

                                            <div class="item-rcol">
                                                <div class="extra">
                                                    <a class="ml10 ftx-05" th:id="${address.getId()}"
                                                       onclick="function alertUpdateAddressDiag(param) {
                                                           var addressId = param.id;
                                                           document.getElementById('addressId_input').value=addressId;
                                                           document.getElementById('consigneeName_input').value=document.getElementById(addressId + '_consignName').textContent;
                                                           var position = document.getElementById(addressId + '_position').textContent;
                                                           document.getElementById('provinceName_input').value=position.split('-')[0];
                                                           document.getElementById('cityName_input').value=position.split('-')[1];
                                                           document.getElementById('regionName_input').value=position.split('-')[2];
                                                           document.getElementById('detailAddress_input').value=document.getElementById(addressId + '_detailAddressNoPrefix').textContent;
                                                           document.getElementById('phone_input').value=document.getElementById(addressId + '_phone').textContent;
                                                           document.getElementById('postcode_input').value=document.getElementById(addressId + '_postcode').textContent;
                                                           document.getElementById('defaultStatus_input').value=document.getElementById(addressId + '_defaultStatus').value;
                                                           document.getElementById('editBox').style.display='block';
                                                       }
                                                       alertUpdateAddressDiag(this);">编辑</a>
                                                    <a class="ml10 ftx-05" th:id="${address.getId()}"
                                                       th:if="${address.getDefaultStatus() == 0}"
                                                       onclick="function setToDefaultAddress(param) {
                                                            var addressId = param.id;
                                                            $.ajax({
                                                                url: 'http://member.meimeimall.com/web/setToDefaultAddress',
                                                                data: {'id':addressId},
                                                                async: false,
                                                                xhrFields: {
                                                                    withCredentials: true
                                                                },
                                                                crossDomain: true,
                                                                success: function (data) {
                                                                    if(data.code === 0){
                                                                        alert('修改成功');
                                                                        location.href='http://member.meimeimall.com/web/address.html';
                                                                    }else{
                                                                        alert(data.msg);
                                                                        location.href='http://member.meimeimall.com/web/address.html';
                                                                    }
                                                                }
                                                            });
                                                       }
                                                       setToDefaultAddress(this);">设为默认</a>
                                                </div>
                                            </div>
                                            <div class="clr"></div>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
<!--container end-->

<span>该页面前端代码扒取自京东</span>
<br>
<span>商城后台管理系统网址:</span>
<br>
<span>全项目代码仓库:</span>
<br>
<span>kubesphere控制台网址:</span>
<br>
<span>矫健 18765969918</span>


<script type="text/javascript">
    (function () {
        var ja = document.createElement('script');
        ja.type = 'text/javascript';
        ja.async = true;
        ja.src = document.location.protocol + '//wl.jd.com/wl.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(ja, s);
    })();


    // var modalBox = document.getElementById("modalBox")
    // var dialog = document.querySelector("dialog");
    // document.querySelector("#show").onclick = function () {
    //     showModal()
    // };
    //
    // function showModal() {
    //     modalBox.style.display = 'block';
    // }
    //
    // document.querySelector("#close").onclick = function () {
    //     close();
    // };
    //
    // function close() {
    //     modalBox.style.display = "none";
    // }

</script>


<script type="text/javascript" src="//misc.360buyimg.com/user/myjd-2015/widget/??common/common.js"
        source="widget"></script>
<script type="text/javascript"></script>
<!--
<script type="text/javascript" src="/js/updatePetName.js"></script>
-->
<script type="text/javascript">
    (function () {
        var ja = document.createElement('script');
        ja.type = 'text/javascript';
        ja.async = true;
        ja.src = ('https:' == document.location.protocol ? 'https://wlssl' : 'http://wl') + '.jd.com/wl.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(ja, s);
    })();
</script>
</body>
</html>
